import {request} from "../../request/index.js";
Page({

  /**
   * 页面的初始数据
   */
  data: {
    //左侧的菜单数组
    leftMenuList:[],
    //右侧的商品数据
    rightContent:[],
    //被点击的左侧的菜单
    currentIndex:0
  },
  Cates:[],


  onLoad(){
    /*
    0 web中的本地存储和小程序的本地存储
      1 写代码的方式不一样了
      web:    localStorge.setItem("key","value") localStorge.getItem("key")
      小程序中:wx.setStorageSync("cates",{time:Date.now(),data:this.Cates});  wx.getStorageSync("key")
      2 web需要类型转换
      3 小程序中不需要

    * 1.先判断本地存储中有没有旧的数据
    * {time:Date.now(),data:{...}}
    * 2 没有 就请求
    * 3 有旧数据 同时没有过期 就用旧数据
    * */

    //1.获取本地存储中的数据(小程序中也存在本地存储技术)
    const Cates =wx.getStorageSync("cates");
    //2.判断
    if(!Cates){
      this.getCates();
    }else {
      //有旧数据 定义一个过期时间
      if(Date.now()-Cates.time>1000*10){
        //重新发送请求
        this.getCates();
      }else {
        //可以使用旧的数据
        this.Cates =Cates.data;
        //构造左侧的大菜单数据
        let leftMenuList = this.Cates.map(v=>v.cat_name);

        //构造右侧的商品数据
        let rightContent = this.Cates[0].children
        this.setData({
          leftMenuList,
          rightContent
        })
      }
    }

    //this.getCates();
  },
  //获取分类数据
  // url:"https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata",
  getCates(){
    request({
      url:"https://api-hmugo-web.itheima.net/api/public/v1/categories",
    }).then(res=>{
     // console.log(res);
      this.Cates = res.data.message;
      //把接口的数据存入到本地存储中
      wx.setStorageSync("cates",{time:Date.now(),data:this.Cates});

      //构造左侧的大菜单数据
      let leftMenuList = this.Cates.map(v=>v.cat_name);

      //构造右侧的商品数据
      let rightContent = this.Cates[0].children
      this.setData({
        leftMenuList,
        rightContent
      })
    })
  },
  //左侧菜单的点击事件
  handleItemTap(e){
    // console.log(e);
    /*
    * 1.获取被点击的标题 身上的索引值
    * 2.给data的currentIndex赋值
    * */
    const {index} = e.currentTarget.dataset;

    let rightContent = this.Cates[index].children
    this.setData({
      currentIndex:index,
      rightContent
    })


  },
})